<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <!-- load css -->
    <link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/css/font/iconfont.css}" media="all"/>
    <link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/js/layui/css/layui.css}"  media="all"/>
    <link rel="stylesheet" type="text/css" th:href="@{/plugin/bootstrap/bootstrap/css/bootstrap.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/plugin/bootstrap-table/bootstrap-table.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/table.css}"  media="all"/>
    <link rel="stylesheet" type="text/css" th:href="@{/plugin/bootstrap/bootstrap/css/bootstrap.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/js/select2/css/select2.css}" media="all"/>

    <style>
        #nnnn{
            position: absolute;
            top: -1rem;
            right: 0;
            z-index: 1000;
        }
        h2{
            margin: 0;
        }
        .blocks{
            display: flex;
            flex-direction: column;
            width: 20rem;
            height: 6rem;
        }
        .blockout{
            display: flex;
            justify-content: space-between;
            margin: 1.5rem 0;
            padding: 0 1rem;
        }
        #auditType{
            display: inline-block;
            min-width: 6rem;
            height: 3rem;
            background-color: #409EFF;
            border-radius: 4px;
            color: white;
            text-align: center;
            line-height: 3rem;
        }
        input[type="text"]:disabled{
            background-color: #EEF1F6;
        }
        input[type="text"],select{
            height: 3rem;
        }
        #suppplierDetail{
            display: none;
        }
        #tableForm{
            display: none;
        }
        #addInfor{
            width: 10rem;
            margin-left: 1rem;
            position: relative;
            top: 1rem;
            z-index: 1;
        }
        #TreeDiv{
            display: flex;
            justify-content: space-around;
        }
        #tree{
            width: 50%;
            height: 60vh;
            overflow: auto;
        }
        #nodesDetail{
            width: 40%;
            height: 15rem;
            border: 1px solid #dddddd;
            border-radius: 0.4rem;
            box-shadow:0 1px 6px rgba(176,196,222,1);

        }
        #nodesDetail div{
            height: 7rem;
            font-size: 1.7rem;
            line-height: 7rem;
            text-indent: 3rem;
        }
    </style>
</head>
<body>
<div class="layui-fluid larry-wrapper" id="StandardVUE">
    <div class="layui-row layui-col-space30">
        <div class="layui-col-xs24">
            <section class="panel panel-padding">
                <div class="layui-collapse" lay-filter="test">
                    <form id="form1" class="layui-form layui-form-pane" action="">
                        <div class="layui-colla-item">
                            <h2 class="layui-colla-title">发运订单表头</h2>
                            <div class="layui-colla-content layui-show">
                                <div class="blockout">
                                    <div class="blocks">
                                        <label>SO编号</label>
                                        <div class="layui-input-inline">
                                            <!--<input type="text" class="layui-input" name="wareHouseName" id="wareHouseName" placeholder="仓库名称"/>-->
                                            <input type="text"
                                                   name="SOcode"
                                                   id="SOcode"
                                                   autocomplete="off"
                                                   class="layui-input"/>
                                        </div>
                                    </div>
                                    <div class="blocks">
                                        <label>优先级</label>
                                        <div class="layui-input-inline">
                                            <select lay-filter="priority"
                                                    lay-verify="required"
                                                    id="priority"
                                                    name="priority">
                                                <option value="1">1</option>
                                                <option value="2">2</option>
                                                <option value="3">3</option>
                                                <option value="4">4</option>
                                                <option value="5">5</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="blocks">
                                        <label>客户编号</label>
                                        <div class="layui-input-inline">
                                            <select lay-filter="clientCode"
                                                    lay-verify="required"
                                                    lay-search
                                                    id="clientCode"
                                                    name="clientCode"
                                                    placeholder="请选择客户编号">
                                            </select>
                                        </div>
                                    </div>
                                    <div class="blocks">
                                        <label>交货方式</label>
                                        <div class="layui-input-inline">
                                            <select lay-filter="receivingType"
                                                    lay-verify="required"
                                                    id="receivingType"
                                                    name="receivingType">
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div id="suppplierDetail">
                                    <div class="layui-collapse" lay-accordion="">
                                        <div class="layui-colla-item">
                                            <h2 class="layui-colla-title">客户详情</h2>
                                            <div class="layui-colla-content layui-show">
                                                <div class="blockout">
                                                    <div class="blocks">
                                                        <label>客户名称</label>
                                                        <span id="clientName"></span>
                                                    </div>
                                                    <div class="blocks">
                                                        <label>路线名称</label>
                                                        <span id="routeName"></span>
                                                    </div>
                                                    <div class="blocks">
                                                        <label>联系电话</label>
                                                        <span id="phone"></span>
                                                    </div>
                                                    <div class="blocks">
                                                        <label>联系人</label>
                                                        <span id="contact"></span>
                                                    </div>
                                                </div>
                                                <div class="blockout">
                                                    <div class="blocks">
                                                        <label>客户地址</label>
                                                        <span id="clientAddress"></span>
                                                        <input hidden name="province" id="province"/>
                                                        <input hidden name="town" id="town"/>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="blockout">
                                    <div class="blocks">
                                        <label>计划发货时间</label>
                                        <div class="layui-input-inline">
                                            <input type="text"
                                                   class="layui-input"
                                                   lay-verify="required"
                                                   id="emitTime"
                                                   name="emitTime"
                                                   placeholder="计划发货时间"/>
                                        </div>
                                    </div>
                                    <div class="blocks">
                                        <label>要求交货时间</label>
                                        <div class="layui-input-inline">
                                            <input type="text"
                                                   class="layui-input"
                                                   lay-verify="required"
                                                   id="receivingTime"
                                                   name="receivingTime"
                                                   placeholder="要求交货时间"/>
                                        </div>
                                    </div>
                                    <div class="blocks">
                                        <label>客户订单号</label>
                                        <div class="layui-input-inline">
                                            <input type="text"
                                                   class="layui-input"
                                                   lay-verify="requiredss"
                                                   name="orderCode"
                                                   id="orderCode"
                                                   placeholder="客户订单号"/>
                                        </div>
                                    </div>
                                    <div class="blocks">
                                        <label>订单类型</label>
                                        <div class="layui-input-inline">
                                            <select lay-filter="orderType"
                                                    lay-verify="required"
                                                    lay-search
                                                    id="orderType"
                                                    name="orderType"
                                                    placeholder="订单类型">
                                            </select>
                                        </div>
                                    </div>

                                </div>
                                <div class="blockout">
                                    <div class="blocks" style="width: 20%">
                                        <label>审核状态</label>
                                        <div class="layui-input-inline">
                                            <span id="auditType"></span>
                                        </div>
                                    </div>
                                    <div class="blocks" style="width: 65%">
                                        <label>备注</label>
                                        <div class="layui-input-inline">
                                            <input type="text" class="layui-input" name="remark" id="" placeholder="备注"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-colla-item">
                            <h2 class="layui-colla-title">发运订单明细</h2>
                            <div id="orderDetail" class="layui-colla-content layui-show">
                                <div id="tableForm">
                                    <div class="blockout">
                                        <div class="blocks">
                                            <label>货品编号</label>
                                            <div class="layui-input-inline" id="goodsCodeS">
                                                <select lay-filter="goodsCode"
                                                        lay-search=""
                                                        id="goodsCode"
                                                        name="goodsCode"
                                                        placeholder="货品编号">
                                                </select>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>货品名称</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled class="layui-input" name="goodsName" id="goodsName" placeholder="货品名称"/>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>包装名称</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled class="layui-input" name="packName" id="packName" placeholder="包装名称"/>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>入库单位</label>
                                            <div class="layui-input-inline">
                                                <select class="form-control selectpicker bla bla bli "
                                                        lay-filter="warehouse"
                                                        id="warehouse"
                                                        name="warehouse"
                                                        placeholder="入库单位">
                                                </select>
                                                <span hidden id="warehouseSpan"></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="blockout">
                                        <div class="blocks">
                                            <label>体积</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled class="layui-input" name="volume" id="volume" placeholder="体积"/>
                                                <span hidden id="volumeS"></span>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>净重</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled class="layui-input" name="suttle" id="suttle" placeholder="净重"/>
                                                <span hidden id="suttleS"></span>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>毛重</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled class="layui-input" name="grossWeight" id="grossWeight" placeholder="毛重"/>
                                                <span hidden id="grossWeightS"></span>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>金额</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled class="layui-input" name="money" id="money" placeholder="金额"/>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="blockout">
                                        <div class="blocks">
                                            <label>主单位</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled="true" class="layui-input" name="unitNumber" id="unitNumber" placeholder="主单位"/>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>箱单位</label>
                                            <div class="layui-input-inline">
                                                <input type="text" disabled="true" class="layui-input" name="boxNumber" id="boxNumber" placeholder="箱单位"/>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>总金额</label>
                                            <div class="layui-input-inline">
                                                <input type="text" class="layui-input" name="numMoney" id="numMoney" />
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>指定库位</label>
                                            <div class="layui-input-inline">
                                                <select lay-filter="appointPlace"
                                                        lay-search=""
                                                        id="appointPlace"
                                                        name="appointPlace"
                                                        placeholder="货品编号">
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="blockout" style="width: 50%">
                                        <div class="blocks">
                                            <label>指定批次</label>
                                            <div class="layui-input-inline">
                                                <select lay-filter="appointBatch"
                                                        lay-search=""
                                                        id="appointBatch"
                                                        name="appointBatch"
                                                        placeholder="指定批次">
                                                </select>
                                            </div>
                                        </div>
                                        <div class="blocks">
                                            <label>指定生产日期</label>
                                            <div class="layui-input-inline">
                                                <select lay-filter="appointDate"
                                                        lay-search=""
                                                        id="appointDate"
                                                        name="appointDate"
                                                        placeholder="指定生产日期">
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="blockout">
                                        <div class="blocks" style="width: 69%">
                                            <label>备注</label>
                                            <div class="layui-input-inline">
                                                <input type="text" class="layui-input" name="datailRemark" id="datailRemark"/>
                                            </div>
                                        </div>
                                        <span hidden id="INDEXS"></span>
                                        <div class="blocks">
                                            <div class="layui-input-inline" style="margin-top: 2rem;">
                                                <a class="layui-btn" onclick="detailSave()">保存</a>
                                                <a class="layui-btn layui-btn-primary" onclick="tableFormReset()">取消</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <a class="layui-btn layui-btn-sm layui-btn-normal" id="addInfor" onclick="tableFormShow()">新增发运订单明细</a>
                                <section class="panel panel-padding layui-card-body" >
                                    <div class="pro">
                                        <table id="table" data-undefined-text=">_<" data-height="300" class="table text-nowrap"></table>
                                    </div>
                                </section>
                            </div>
                        </div>

                        <div class="layui-colla-item">
                            <h2 class="layui-colla-title">订单渠道</h2>
                            <div class="layui-colla-content layui-show" style="border-bottom: 2px solid #C5C5C5">
                                <div id="TreeDiv">
                                    <div id="tree"></div>
                                    <div id="nodesDetail">
                                        <div style="border-bottom: 1px solid #dddddd;">订单渠道 详情 (选中的订单渠道下的渠道名称会展示在下面)</div>
                                        <div>渠道名称： <span id="channelName"></span></div><span hidden id="channelId"></span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item" style="margin: 2rem 0;">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                            </div>
                        </div>
                    </form>
                </div>
            </section>
        </div>
    </div>
</div>
</body>
<div th:include="public/public_js::public_js"></div>
<script th:src="@{plugin/beyond/assets/js/fuelux/wizard/wizard-custom.js}"></script>

<script>

    var indexs = 0;
    var supplierInf;
    var POtypeData;

    // option渲染方法
    function optionRendering(data, type, value, text1, text2) {
        var optionInf = '';
        if (type === 1) {
            data.forEach(function (item) {
                optionInf += '<option value="'+ item[value] +'">'+ item[text1] +'</option>';
            })
        }
        if (type === 2) {
            data.forEach(function (item) {
                optionInf += '<option value="'+ item[value] +'">'+ item[text1] + ' ' + item[text2] +'</option>';
            })
        }

        return optionInf;
    }

    // 根据包装类型判断主单位是否禁用
    function packageType(type) {
        if (type == 0) {
            $('#unitNumber').attr("disabled",false);
            $('#boxNumber').attr("disabled",true);
        } else {
            $('#unitNumber').attr("disabled",true);
            $('#boxNumber').attr("disabled",false);
        }
    }

    // 查询入库单位
    function wareHouseUnit(id) {
        var DATA;
        $.ajax({
            url: '/zxsswms/wmsPurchaseOrder/packDetailList/' + id,
            type: 'GET',
            dataType: 'json',
            contentType: 'application/json',
            async: false,
            success: function (data) {
                DATA = data;
            }
        })
        return DATA;
    }

    // 订单渠道tree渲染
    function Orderchannel() {
        var result;
        // 树的查询
        $.ajax({
            url: '/zxsswms/wmsorderchannel/list',
            type: 'POST',
            dataType: 'json',
            async: false,
            contentType: 'application/json',
            success: function (data) {
                result = data;
                console.log('data', data);
            }
        })
        var DATA;
        if (result.length > 0) {
            DATA = treeDataFormat(result);
            var treeInitialize = [{
                text: '订单渠道',
                nodes: DATA,
            }];
            var tree = function () {
                $('#tree').treeview({
                    color: "#428bca",
                    showBorder: true,
                    data: treeInitialize,
                    selectable: true,
                    highlightSelected: true,
                    // showCheckbox: true,启用checkbox
                    multiSelect: false,       //多选
                    onNodeSelected: function (event, node) {
                        console.log('node', node);
                        $('#channelName').text(node.text);
                        $('#channelId').text(node.nodeid);
                    },
                });
            }
            var init = function () {
                tree();
            }
            init();
        }
    }

    // tree数据格式化
    function treeDataFormat(data) {
        var arr = [];
        for (var i = 0; i < data.length; i++) {
            var  Is = {};
            Is.text = data[i].mc;
            Is.nodeid = data[i].id;
            if (data[i].children.length > 0) {
                Is.nodes = treeDataFormat(data[i].children);
            }
            arr.push(Is);
        }
        return arr;
    }

    function returnpage() {
        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index); //再执行关闭
    }

    function toFixeds (data) {
        var str = "";
        if (data) {
            data = data.toString();
            if (data.indexOf('.') < 0) {
                str = data;
            } else {
                str = data.substring(0, data.indexOf('.') + 3);
            }
            return parseFloat(str);
        } else {
            return data;
        }
    }

    layui.use(['myform','zzpUtils','form','laydate','jquery','zzpValidation'],function () {
        var form = layui.form,
            zzpUtils = layui.zzpUtils
            ,laydate = layui.laydate
            ,zzpValidation = layui.zzpValidation
            ,$ = layui.jquery;

        var UnitNum, UnitType, INDEXS = 0, INDEXS = 0;

        $(function () {

            //查询编号
            $.ajax({
                url: '/zxsswms/wmsshipmentorder/getBh',
                type: 'GET',
                dataType: 'json',
                contentType: 'application/json',
                async: false,
                success: function (data) {
                    $('#SOcode').val(data.bh);
                }
            })

            // 查询客户信息
            var ClientInf = QueryClientInf({});
            var ClientOption = '<option></option>';
            ClientOption += optionRendering(ClientInf, 2, 'id', 'khbh', 'khmc');
            $('#clientCode').find("option").remove();
            $('#clientCode').append(ClientOption);
            form.render('select');

            // 查询订单类型
            var OrderType = QueryOrderType({});
            var OrderOption = '<option></option>';
            OrderOption += optionRendering(OrderType, 1, 'id', 'ddlx');
            $('#orderType').find("option").remove();
            $('#orderType').append(OrderOption);
            form.render('select');

            // 查询交货方式
            zzpUtils.select({
                elem:"#receivingType",
                url:"/sysdictionary/getSysdictionary/wms_quality_testing_jhfs"
            });

            // 订单渠道树的渲染
            Orderchannel();

        })

        // 计划发货时间的初始化
        laydate.render({
            elem: '#emitTime'
            ,type: 'datetime'
        });

        // 要求到货时间的时间初始化
        laydate.render({
            elem: '#receivingTime'
            ,type: 'datetime'
        });

        // 查询客户信息
        function QueryClientInf(data){
            var clientInf;
            zzpUtils.action({
                url:"/wmsshipmentorder/getCusInfo",
                data: JSON.stringify(data),
                async: false,
                success:function (data) {
                    clientInf = data;
                },error: function (xhr, textStatus) {
                    console.log(textStatus);
                    console.log(xhr)
                }
            });
            return clientInf;
        }

        // 查询订单类型
        function QueryOrderType(data){
            var orderType;
            zzpUtils.action({
                url:"/wmsshipmentorder/getPoLx",
                data: JSON.stringify(data),
                async: false,
                success:function (data) {
                    orderType = data;
                },error: function (xhr, textStatus) {
                    console.log(textStatus);
                    console.log(xhr)
                }
            });
            return orderType;
        }

        //查询货品编号
        function goodsCode(ids) {
            var DATA;
            $.ajax({
                url: '/zxsswms/wmsshipmentorder/getGoodsByHzid',
                type: 'POST',
                dataType: 'json',
                contentType: 'application/json',
                data: JSON.stringify(ids),
                async: false,
            }).then(function (resolve) {
                DATA = resolve;
            })
            return DATA;
        }

        // 查询入库单位
        function wareHouseUnit(id) {
            var DATA;
            $.ajax({
                url: '/zxsswms/wmsPurchaseOrder/packDetailList/' + id,
                type: 'GET',
                dataType: 'json',
                contentType: 'application/json',
                async: false,
                success: function (data) {
                    DATA = data;
                }
            })
            return DATA;
        }

        // 查询指定库位
        function QueryAppointPlace(data) {
            var DATA;
            $.ajax({
                url: '/zxsswms/wmsshipmentorder/getLiLibraryPosition',
                type: 'POST',
                dataType: 'json',
                contentType: 'application/json',
                data: JSON.stringify(data),
                async: false,
                success: function (data) {
                    DATA = data;
                }
            })
            return DATA;
        }

        // 查询指定批次
        function QueryAppointBatch(data) {
            var DATA;
            zzpUtils.action({
                url:"/wmsshipmentorder/getWmsStock",
                data: JSON.stringify(data),
                async: false,
                success:function (data) {
                    DATA = data;
                },
                error: function (xhr, textStatus) {
                    console.log(textStatus);
                    console.log(xhr)
                }
            });
            return DATA;
        }

        // 查询指定生产日期
        function QueryAppointDate(data) {
            var DATA;
            zzpUtils.action({
                url:"/wmsshipmentorder/getWmsStockScrq",
                data: JSON.stringify(data),
                async: false,
                success:function (data) {
                    DATA = data;
                },
                error: function (xhr, textStatus) {
                    console.log(textStatus);
                    console.log(xhr)
                }
            });
            return DATA;
        }

        // 选择客户编号时触发
        form.on('select(clientCode)', function (data) {
            if (data.value) {
                //var clientCode = $("#clientCode").find("option:selected").text();
                var clientCode = $("#clientCode").val();
                //var data = QueryClientInf({khbh: clientCode});
                var data = QueryClientInf({});
                for (var i = 0; i < data.length; i++) {
                    var item = data[i];
                    if (item.id == clientCode) {
                        $('#clientName').text(item.khmc);
                        $('#routeName').text(item.xlmc);
                        $('#phone').text(item.lxrdh);
                        $('#contact').text(item.lxrxm);
                        $('#clientAddress').text(item.khdz);
                        $('#province').val(item.sheng);
                        $('#town').val(item.shi);
                        break;
                    }
                }
                $('#suppplierDetail').css('display', 'block');
            }
        })

        // 选择订单类型时触发
        form.on('select(orderType)', function (data) {
            if (data.value) {
                var clientCode = $("#orderType").find("option:selected").text();
                console.log('clientSelect', clientCode);
                var data = QueryOrderType({ddlx: clientCode});
                $('#auditType').text(data[0].show_zdsh);
            }
        })

        // 货品编号的选中触发
        form.on('select(goodsCode)', function (data) {
            console.log('货品编号选中触发');
            if (data !== '') {
                var text = $("#goodsCode").find("option:selected").text();
                var ids = {'bh': text};
                var goodsCodeData = goodsCode(ids)[0];
                $('#goodsName').val(goodsCodeData.bzmc);//包装名称
                $('#packName').val(goodsCodeData.bzmc);//货品名称

                var packId = goodsCodeData.packId;
                var warehouseunit = wareHouseUnit(packId);
                warehouseOption(warehouseunit);

                // 给批次号和生产日期赋option
                var appointBatch = QueryAppointBatch({hpid: data.value});
                var appointBatchOption = '<option value="">不指定</option>';
                var Batchdata = optionRendering(appointBatch, 1, 'hppc', 'hppc');
                if (Batchdata) {
                    appointBatchOption += Batchdata;
                }
//                appointBatchOption += optionRendering(appointBatch, 1, 'hppc', 'hppc');
                $('#appointBatch').find("option").remove();
                $('#appointBatch').append(appointBatchOption);

                var appointDate = QueryAppointDate({hpid: data.value});
                var appointDateOption = '<option value="">不指定</option>';
                var Datedata = optionRendering(appointDate, 1, 'scrq', 'scrq');
                if (Datedata) {
                    appointDateOption += Datedata;
                }
//                appointDateOption += optionRendering(appointDate, 1, 'scrq', 'scrq');
                $('#appointDate').find("option").remove();
                $('#appointDate').append(appointDateOption);

                //解除批次号和生产日期的禁用
                $('#appointBatch').attr("disabled",false);
                $('#appointDate').attr("disabled",false);
                form.render('select');
            }
        })

        // 给入库单位赋option
        function warehouseOption(data) {
            $('#warehouse').find("option").remove();
            var options = '<option value="">请选择</option>';
            data.forEach(function (item) {
                options += "<option title='"+ JSON.stringify(item) +"' value='"+ item.ms +"'>"+ item.ms +"</option>";
            });
            $('#warehouse').append(options);
            form.render();
            return;
        }

        // 入库单位选中触发
        form.on('select(warehouse)', function (data) {
            var datas = $('#warehouse').find("option:selected");
            console.log('warehousewarehouse', datas);
            var wareHouseData = JSON.parse(datas[0].title);
            $('#volume').val(wareHouseData.tj);
            $('#volumeS').text(wareHouseData.tj);

            $('#suttle').val(wareHouseData.jz);
            $('#suttleS').text(wareHouseData.jz);

            $('#grossWeight').val(wareHouseData.zl);
            $('#grossWeightS').text(wareHouseData.zl);

            $('#money').val(wareHouseData.je);
            $('#numMoney').val(0);
            $('#unitNumber').val(0);
            $('#boxNumber').val('0箱0件');

            $('#warehouseSpan').text(wareHouseData.id);

            packageType(wareHouseData.bzlx);
            // 主单位数量
            UnitNum = wareHouseData.zdwsl;
            UnitType = wareHouseData.bzlx;

        })

        // 监听主单位数量
        $('#unitNumber').on('input propertychange', function(data) {
            var value =  data.currentTarget.value;
            var len, lenfloat;
            var volumeS = parseFloat($('#volumeS').text());
            var suttleS = parseFloat($('#suttleS').text());
            var grossWeightS = parseFloat($('#grossWeightS').text());
            var money = parseFloat($('#money').val());
            // 如果value不为空
            if (value && value !== '0') {
                len = parseInt(value);
                lenfloat = parseFloat(value);
                if (value.indexOf('-') >= 0) {
                    $('#unitNumber').val('');
                } else if ((lenfloat - len) > 0) {
                    $('#unitNumber').val(len);
                } else {
                    $('#volume').val(toFixeds(volumeS * len));
                    $('#suttle').val(toFixeds(suttleS * len));
                    $('#grossWeight').val(toFixeds(grossWeightS * len));
                    $('#numMoney').val(toFixeds(money * len));

                    // 如果主单位数量为1
                    if (UnitNum === 1) {
                        $('#boxNumber').val(len.toString() + '箱0件');
                    } else {
                        var BOX,PIECE;
                        BOX = parseInt(len/UnitNum);
                        PIECE = len%UnitNum;
                        $('#boxNumber').val(BOX + '箱'+ PIECE +'件');
                    }

                }

            } else {
                $('#volume').val(volumeS);
                $('#suttle').val(suttleS);
                $('#grossWeight').val(grossWeightS);
                $('#numMoney').val(0);
                $('#boxNumber').val('0箱0件');
            }

        })

        // 监听箱单位数量
        $('#boxNumber').on('input propertychange', function(data) {
            var value, indbox, indpiece, box, piece, boxs, pieces;
            var volumeS = parseFloat($('#volumeS').text());
            var suttleS = parseFloat($('#suttleS').text());
            var grossWeightS = parseFloat($('#grossWeightS').text());
            var money = parseFloat($('#money').val());
            value =  data.currentTarget.value;
            indbox = value.indexOf('箱');
            indpiece = value.indexOf('件');
            box = value.substring(0, indbox);
            piece = value.substring(indbox + 1,  indpiece);
            boxs = parseFloat(box) - parseInt(box);
            pieces = parseFloat(piece) - parseInt(piece);
            if (boxs > 0 && pieces > 0) {
                $('#unitNumber').val(box + '箱'+ piece +'件');
            }
            if (boxs < 0 && pieces > 0) {
                $('#unitNumber').val(Math.abs(box) + '箱'+ piece +'件');
            }
            if (boxs > 0 && pieces < 0) {
                $('#unitNumber').val(box + '箱'+ Math.abs(piece) +'件');
            }
            if (parseInt(box) >= 0 && parseInt(piece) >= 0) {
                var unitNumber = parseInt(box) * UnitNum + parseInt(piece);
                var len;
                if (unitNumber !== 0) {
                    len = unitNumber;
                    $('#numMoney').val(toFixeds(money * len));
                } else {
                    len = 1;
                    $('#numMoney').val(0);
                }
                $('#unitNumber').val(unitNumber);
                $('#volume').val(toFixeds(volumeS * len));
                $('#suttle').val(toFixeds(suttleS * len));
                $('#grossWeight').val(toFixeds(grossWeightS * len));

            }
        })

        // 行内按钮
        window.operateEvent ={

            // 触发table行内回显
            "click #editRow":function (e, value, row, index) {
                $('#tableForm').css('display','block');
                $('#addInfor').css('display','none');
                zzpUtils.loadJsonDataToForm(row);
                $('#INDEXS').text(row.index);
                form.render('select');

            },
            "click #delete":function (e, value, row, index) {
                console.log('触发了删除', row);
                var id = [];
                id.push(row.goodsCode);
                // 使用remove方法时values必须是一个数组
                blanktable.bootstrapTable('remove', {field: 'goodsCode', values: id});

                var tableData = blanktable.bootstrapTable('getData');
                // 加载数据到表格中，旧数据会被替换,相当于刷新table
                blanktable.bootstrapTable('load', tableData);
            },
        }

        function operateFormatter(value, row, index) {
            return [
                '<a class="layui-btn layui-btn-xs" id="editRow">编辑</a>',
                '<a class="layui-btn layui-btn-danger layui-btn-xs" id="delete">删除</a>'
            ].join('')
        }

        // 初始化一个空table
        var blanktable = zzpUtils.table({
            elem: '#table',
            isApi: true,
            pagination: false,//分页开关
            checkboxHeader: false,
            showColumns: false,// 列选择
            columns: [
                {field:'goodsbh',title:'货品编号'},
                {field:'goodsName',title:'货品名称'},
                {field:'packName',title:'包装名称'},
                {field:'warehouse',title:'主单位'},
                {field:'unitNumber',title:'预期数量'},
                {field:'boxNumber',title:'预期数量'},
//                {field:'bh',title:'货品编号'},
//                {field:'mc',title:'货品名称'},
//                {field:'bzmc',title:'包装名称'},
//                {field:'ms',title:'主单位'},
//                {field:'yqsl',title:'预期数量'},
//                {field:'yqxdwsl',title:'预期数量'},
//                {field:'fpsl',title:'分配数量'},
//                {field:'jhsl',title:'拣货数量'},
//                {field:'fysl',title:'发运数量'},
//                {field:'kwmc',title:'库位名称'},
//                {field:'pc',title:'批次号'},
//                {field:'scrq',title:'生产日期'},
//                {field:'show_fymxzt',title:'SO状态'},
//                {field:'show_zbfh',title:'暂不发货'},
                {
                    field:'caozuo',
                    title: '操作',
                    events:operateEvent,
                    formatter:operateFormatter
                }],
        });

        // 新增按钮触发
        window.tableFormShow = function (data) {
            console.log('新增触发')
            $('#tableForm').css('display','block');
            $('#addInfor').css('display','none');
            $('#tableForm input').val('');//重置input
            $('#tableForm select').val('');
            form.render('select');
            var GoodsCode = goodsCode({});

            var goodsOptionInf = '<option></option>';
            goodsOptionInf += optionRendering(GoodsCode, 1, 'goodsId', 'goodsBh');
            // 给货品编号赋option
            $('#goodsCode').find("option").remove();
            $('#goodsCode').append(goodsOptionInf);

            // 查询指定库位
            var appointPlace = QueryAppointPlace({});
            var PlaceOptionInf = '<option value="">不指定</option>';
            PlaceOptionInf += optionRendering(appointPlace, 1, 'id', 'mc');
            //给指定库位赋option
            $('#appointPlace').find("option").remove();
            $('#appointPlace').append(PlaceOptionInf);
            // 重新渲染form，否则新的option不显示
            form.render();
        }

        // 保存触发：向table添加数据
        window.detailSave = function() {
            var data = {};
            console.log('tableform保存触发测试');
            data.goodsCode = $("#goodsCode").val();
            data.goodsbh = $("#goodsCode").find("option:selected").text();// 货品编号
            data.goodsName = $('#goodsName').val();// 货品名称
            data.packName = $('#packName').val(); // 包装名称
            data.warehouse = $('#warehouse').val();// 入库单位
            data.volume = $('#volume').val();// 体积
            data.volumeS = $('#volumeS').text();
            data.suttle = $('#suttle').val();// 净重
            data.suttleS = $('#suttleS').text();
            data.grossWeight = $('#grossWeight').val();// 毛重
            data.grossWeightS = $('#grossWeightS').text();
            data.money = $('#money').val();// 单价
            data.numMoney = $('#numMoney').val();// 总金额
            data.datailRemark = $('#datailRemark').val();// 备注
            data.unitNumber = parseInt($('#unitNumber').val());// 主单位数量
            data.boxNumber = $('#boxNumber').val();// 箱单位数量
            data.zdw = $('#warehouseSpan').text();//入库单位id
            data.zdwsl = UnitNum;
            data.appointPlace = $('#appointPlace').val();//指定库位的库位id
            data.appointBatch = $('#appointBatch').val();//指定批次
            data.appointDate = $('#appointDate').val();// 指定生产日期
            data.pc = $('#appointBatch').val();//指定批次
            data.scrq = $('#appointDate').val();// 指定生产日期

            if (data.ms !== '') {
                if(data.sl !== '') {
                    var blanktableData = blanktable.bootstrapTable('getData');
                    if (blanktableData.length === 0) {
                        data.index = 0;
                        console.log('添加第一条数据', data);
                        blanktable.bootstrapTable('append', data);
                        $('#tableForm').css('display','none');
                        $('#addInfor').css('display','block');
                    } else {
                        var type = blanktableData.every(function (item) {
                            return item.goodsCode !== data.goodsCode;
                        });
                        if (type) {
                            console.log('执行添加');
                            indexs += 1;
                            data.index = indexs;
                            blanktable.bootstrapTable('append', data);
                        } else {
                            console.log('执行更新');
                            var In = parseInt($('#INDEXS').text());
                            blanktable.bootstrapTable('updateRow', {index: In, row: data});
                        }
                        $('#tableForm').css('display','none');
                        $('#addInfor').css('display','block');
                    }
                } else {
                    layer.msg('您必选填写主单位或箱单位');
                }
            } else {
                layer.msg('您必选选择货品和入库单位');
            }

            $('#orderDetail input[type="text"]').val('');
        }

        // 取消按钮触发
        window.tableFormReset = function(){
            $('#tableForm').css('display','none');
            $('#addInfor').css('display','block');
            $('#tableForm input').val('');
        }

        // 最终保存
        form.on("submit(add)",function(data){
            var field = data.field;
            console.log('fieldfield', field);
            zzpUtils.confirm("是否确定添加",function(index){
                //获取table数据
                var TableData = blanktable.bootstrapTable('getData');
                console.log('TableData', TableData);
                var SaveData = {};
                if (TableData.length > 0) {
                    if ($('#channelName').text() !== '') {
                        var newTableData = [];
                        TableData.forEach(function (item) {
                            var items = {};
                            items.bh = item.goodsbh;
                            items.bz = item.datailRemark;
                            items.bzmc = item.packName;
                            items.hpid = item.goodsCode;
                            items.je = item.numMoney;
                            items.jz = item.suttle;
                            items.kwid = item.appointPlace;
                            items.kwmc = $("#appointPlace").find("option:selected").text();
                            items.mc = item.goodsName;
                            items.ms = item.warehouse;
                            items.pc = item.appointBatch;// 指定批次
                            var scrq = field.appointDate;
                            scrq = new Date(scrq);
                            items.scrq = scrq.getTime();
                            items.tj = item.volume;
                            items.yqsl = item.unitNumber;
                            items.yqxdwsl = item.boxNumber;
                            items.zdw = $('#warehouseSpan').text();
                            items.zdwsl = UnitNum;
                            items.zl = item.grossWeight;

                            newTableData.push(items);
                        });

                        console.log('newTableData', newTableData);

                        SaveData.bz = field.remark;
                        SaveData.ddqdid = $('#channelId').text();
                        SaveData.fybh = field.SOcode;
                        SaveData.yxj = field.priority // 优先级
                        SaveData.fylx = field.orderType;//订单类型
                        var time1 = field.emitTime;
                        time1 = new Date(time1);
                        SaveData.jhfhsj = time1.getTime();//计划发货时间
                        var time2 = field.receivingTime;
                        time2 = new Date(time2);
                        SaveData.yqjhsj = time2.getTime();// 要求交货时间
                        SaveData.jhfs = field.receivingType;// 交货方式
                        SaveData.khddh = field.orderCode; // 客户订单号
                        SaveData.khdz = $('#clientAddress').text();// 客户地址
                        SaveData.khid = field.clientCode;
                        SaveData.lxrdh = $('#phone').text();// 联系人电话
                        SaveData.lxrxm = $('#contact').text();// 联系人姓名
                        SaveData.sheng = field.province;
                        SaveData.shi = field.town;
                        SaveData.wsodList = newTableData;

                        $.ajax({
                            url: '/zxsswms/wmsshipmentorder/add',
                            type: 'POST',
                            dataType: 'json',
                            contentType: 'application/json',
                            data: JSON.stringify(SaveData),
                            success: function (data) {
                                layer.msg(data.title);
                                if (data.type === 'success') {
                                    setTimeout(function(){
                                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                        parent.layer.close(index); //再执行关闭
                                        top.layer.msg(data.message);
                                    },500);
                                }
                            },
                            error: function (err) {
                                console.log(err);
                            }
                        })
                    } else {
                        layer.msg('您还未选择订单渠道');
                    }
                } else {
                    layer.msg('您还不能保存，发运订单明细为必填项');
                }
            })
            return false;
        })
    });

</script>
</html>